<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>let与var的区别</title>
    <script>
        //var
        function  f1(){
        // 变量名可以重复
            var a=1;
            var a=2;
            //var没有作用域
            for(var i=1;i<10;i++){

            }
            console.log(i)
            // 3.存在变量提升
            // 所谓的变量提升,指的是先打印在声明
            // console.log(b);
            // 此时打印结果为undefined,表示变量已经声明,但是尚未赋值
            // var b = 1;

            // 上述代码相当于下面代码
            var b;
            console.log(b);
            b = 1;
        }
        function f2() {
            // let的语法类似于Java
            // 1.变量名不能重复
            let a = 1;
            // let a = 2;

            // 2.let存在作用域
            for(let i = 0; i< 10; i++){

            }
            // console.log(i);

            // 3.不存在变量提升
            console.log(b);
            let b = 1;
        }
    </script>
</head>
<body>
<button onclick="f1()">var语法</button>
<br>
<button onclick="f2()">let语法</button>
</body>
</html>